<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <!--引用css文件-->
    <link rel="stylesheet" href="style.css">
    <style>
        .font {

        }

        body {
            /*background-image: url(../static/honghuhuxinting.jpg);*/
            /*background-repeat: no-repeat;*/
            /*background-size: 100%*/
        }

        /* 列表样式 */
        .listStyle1{
            list-style-type: none;
            list-style-position: inside ;
        }

        a{
            text-decoration: none; /*去掉下划线*/
            /*color: gray;如果使用color设置超链颜色，则未激活、鼠标点下去、激活后颜色都是同一
            个颜色 */
        }
        /* a:link 超链接初始状态(未激活) */
        a:link{
            color: darkcyan;
        }
        /* a:hover 设置鼠标悬停的样式 */
        a:hover{
            color:blue
        }
        /* a:active 设置超链接鼠标点击下去时的样式*/
        a:active{
            color: orange;
        }
        /* a:visited 设置激活后的超链接的样式 */
        a:visited{
            color:gray
        }

        .btnStyle{
            border: #008B8B 1px solid;
            border-radius: 3px;
            width: 180px;
            height: 30px;
            color: #008B8B;
        }
        .btnStyle:hover{
            background: #008B8B;
            color: white;
        }
    </style>
</head>
<body style="background-color: aliceblue;">
top
<!--<img id="img3" class="image"  src="../static/honghuhuxinting.jpg" >-->

<button style="border: red solid 4px;border-radius: 5px 5px;width: 50px;height: 30px;margin: 10px 3px;padding: 5px">
    按钮
</button>

<label class="font" style="font-size: 20px;font-weight: bold;color: rebeccapurple;font-family: 楷体">文字</label>
<ul class="listStyle1">
    <li>苹果</li>
    <li>梨子</li>
    <li>香蕉</li>
    <li>西瓜</li>
</ul>
<a href="left.html">form</a>

<button class="btnStyle">测试按钮</button>
</body>
</html>